<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>官网</title>
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <script src="js/jQuery.min.js"></script>
    <script src="js/swiper-3.4.2.min.js"></script>
    <script src="js/swiper-3.4.2.jquery.min.js"></script>
    <link rel="stylesheet" href="css/index.css">
    <link rel="stylesheet" href="css/swiper-3.4.2.min.css">
    <style>
        html, body {
            width: 100%;
            overflow-x: hidden;
        }

    </style>
</head>
<body oncontextmenu="return false">
<div class="bigDiv">
    <!--头部-->
    <header>
        <!--90%头部-->
        <div class="headermain">
            <div class="headerleft">
                <div><img src="img/pocket.png" alt=""></div>
                <div class="nav">
                    <ul>
                        <li><a href="home.html">首页</a> </li>
                        <li><a href="about.html">关于我们</a> </li>
                        <li><a href="servise.html">服务项目</a> </li>
                        <li><a href="methods.html">解决方案</a> </li>
                        <li><a href="example.html">经典案例</a> </li>
                        <li><a href="newCenter.html">新闻中心</a> </li>
                        <li><a href="contactUs.html">联系我们</a> </li>
                    </ul>
                </div>
            </div>
            <!--登录-->
            <div class="headerright">
                <ul>
                    <li><span>登录</span><span>·</span><span>注册</span></li>
                    <li><span>服务热线：15810381861</span></li>
                </ul>
            </div>
        </div>
    </header>


    <!--网页主体部分-->
    <div class="main">
        <div class="swiper">
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide"><img src="img/banner-1.png" alt=""></div>
                    <div class="swiper-slide"><img src="img/bgg.png" alt=""></div>
                    <div class="swiper-slide"><img src="img/banner.jpg" alt=""></div>

                </div>
                <!-- 如果需要分页器 -->
                <!--<div class="swiper-pagination"></div>-->

                <!-- 如果需要导航按钮 -->
                <!--<div class="swiper-button-prev"></div>-->
                <!--<div class="swiper-button-next"></div>-->

                <!-- 如果需要滚动条 -->
                <div class="swiper-scrollbar"></div>
            </div>
        </div>

    </div>
    <!--网页脚本-->
    <footer>

    </footer>
</div>
</body>
<script>
    var mySwiper = new Swiper('.swiper-container', {
        direction: 'horizontal',
        autoplay : 3000,
        loop: true,

        // 如果需要分页器
        pagination: '.swiper-pagination',

        // 如果需要前进后退按钮
        nextButton: '.swiper-button-next',
        prevButton: '.swiper-button-prev',

        // 如果需要滚动条
        scrollbar: '.swiper-scrollbar',
        effect : 'fade',
        slidesPerView: 3,
        centeredSlides: true,
        coverflow: {
            rotate: 30,
            stretch: 10,
            depth: 60,
            modifier: 2,
            slideShadows : true}
    })
    $(function(){

        var imglist =document.getElementsByTagName("img");
//安卓4.0+等高版本不支持window.screen.width，安卓2.3.3系统支持
        /*
        var _width = window.screen.width;
        var _height = window.screen.height - 20;

        var _width = document.body.clientWidth;
        var _height = document.body.clientHeight - 20;
        */
        var _width,
            _height;
        doDraw();

        window.onresize = function(){
            doDraw();
        }

        function doDraw(){
            _width = window.innerWidth;
            _height = window.innerHeight - 20;
            for( var i = 0, len = imglist.length; i < len; i++){
                DrawImage(imglist[i],_width,_height);
            }
        }

        function DrawImage(ImgD,_width,_height){
            var image=new Image();
            image.src=ImgD.src;
            image.onload = function(){
                if(image.width>30 && image.height>30){

                    if(image.width/image.height>= _width/_height){
                        if(image.width>_width){
                            ImgD.width=_width;
                            ImgD.height=(image.height*_width)/image.width;
                        }else{
                            ImgD.width=image.width;
                            ImgD.height=image.height;
                        }
                    }else{
                        if(image.height>_height){
                            ImgD.height=_height;
                            ImgD.width=(image.width*_height)/image.height;
                        }else{
                            ImgD.width=image.width;
                            ImgD.height=image.height;
                        }
                    }
                }
            }

        }

    })

</script>
<script src="js/shipei.js"></script>
<script>
$(function () {
    $('header').on('click',function (e) {
        console.log(e)
    })
})

</script>
</html>